class Main extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: {
                idcsrc: [],
                data1: '',
            },
            u: {

            },
            list: [],
            name: '',
            chosefile: !1,
            id: 0,
            name: "",
            fetching: !1,
            keyword: "",
            orders: 1,
            userid: "",
            batchNo: '',
            totalAmt: '',
            appRemark: '',
            totalCount: '',
            ismemberexclusive: "0",
            isnewcomers: "0",
            goodssn: "",
            specs: "",
            unit: "",
            stock: "",
            imgsrc: '',
            price: '',
            lbhtml: [],
            lbimglist: [],
            type: 0,
            isindex: "0",
            score: '',
            isscore: "0",
            path: '',
            reason:'',
        };
    }
    // 批次号：总金额：备注：总笔数：
    submit(r) {
        let {data,reason} = this.state
        if(reason==''){
            alert('描述不能为空')
        }else{
            apply_check({reason,id:data.id,ispass:r=='refuse'?'-1':'1'},res=>{
                if(res.issuccess==1){
                    alert('提交成功')
                    window.location.href='./apply.html'
                }
            })
        }

        // if(r=='refuse'){
        //     let{reason} = this.state
        //     if(reason==''){
        //         alert('描述不能为空')
        //     }else{
        //         apply_check({reason,id:data.id},res=>{
        //             if(res.issuccess==1){
        //                 alert('提交成功')
        //             }
        //         })
        //     }
        // }else{
        //     apply_check({id:data.id},res=>{
        //         if(res.issuccess==1){
        //             alert('提交成功')
        //         }
        //     })
        // }


        // var { totalAmt, totalCount, path } = this.state,
        //     that = this, err = '';
        // console.log({ totalAmt, totalCount, path }, '1submit');
        // //  if (batchNo == "") err = "请输入批次号"
        // if (totalAmt == "") err = "请输入总金额"
        // if (totalCount == "") err = "请输入总笔数"
        // if (path == '') err = '请上传文件'
        // if (err.length > 0) {
        //     alert(err);
        //     return
        // }

       
    }

    componentDidMount() {
        this.setState({ showloading: '' })
        let that = this, { } = that.state, typehtml = [];
        let id = GetQueryString('id')
        console.log(id == "null", 'ddd');
        if (!isNaN(id)) {
            apply_getd(id, res => {
                let { data, u } = res
                data['idcsrc'] = data['idcardsrc'].split(',')
                console.log(data, 'tata');
                that.setState({ data,reason:data.reason, u })
            })
        }
        // getTypelist(res => {
        //     if (res.issuccess == 1) {
        //         if (res.list.length > 0) {
        //             typehtml.push(
        //                 <option value="0">请选择</option>
        //             )
        //             res.list.forEach((x, i) => {
        //                 typehtml.push(
        //                     <option key={i} value={x.id}>{x.name} </option>
        //                 )

        //             })
        //             this.setState({ typehtml })
        //         }
        //     }
        // })
        // let UE = window.UE
        // let ueditor = UE.getEditor('ueditor', {
        //     autoHeightEnabled: true,
        //     autoFloatEnabled: true
        // });
        // ueditor.addListener("ready", function () {
        //     that.setState({ ueditor, }, () => {
        //         let id = GetQueryString('id')
        //         if (id != 'null' && id) {
        //             that.setState({ id }, () => {
        //                 that.freshlist()
        //             })
        //         } else {
        //             that.setState({ showloading: '' })
        //         }
        //     });
        // }, 2);
    }

    freshlist() {
        let { id, ueditor } = this.state, that = this, lbimglist = [], img = [], lbhtml = [];
        getGoodsdetail(id, res => {
            this.setState({ showloading: '' })
            if (res.issuccess == 1) {
                let { } = this.state,
                    { name, detail, stock, ismemberexclusive, isindex, isnewcomers, specs, type, unit, price, imgsrc, lbimgs, goodssn, isscore, score } = res.data
                imgsrc = `${API_HEAD}imgs/${imgsrc}`
                img = lbimgs.split(',')
                img.forEach(x => {
                    x = `${API_HEAD}imgs/${x}`
                    lbimglist.push(x)
                })
                lbimglist.forEach((x, i) => {
                    lbhtml.push(
                        <div className="lbimg">
                            <img className="img" src={x} />
                            <div className="imgmodel">
                                <div className="delbox">
                                    <img src="./src/dellb.png" onClick={this.del_img.bind(this, 'lb', i)} />
                                </div>
                            </div>
                        </div>
                    )
                })
                ueditor.setContent(that.replaceraw(decodeURIComponent(detail)))
                that.setState({ name, stock, ismemberexclusive, isnewcomers, specs, type, unit, price: (price / 100.00), name, imgsrc, lbimglist, lbhtml, goodssn, isindex, isscore, score })
            }
        })
    }


    inputchange(prop, e) {
        this.setState({ [prop]: e.target.value })
    }
    search() {
        let that = this
        that.setState({ showloading: 'ON' }, () => {
            that.getuserlist()
        })
    }
    inputchange1(prop, e) {
        // let { isrecommend } = this.state
        // [prop] = [prop] == "1" ? "0" : "1"
        this.setState({ [prop]: e == true ? "1" : "0" })
    }
    inputchange3(prop, e) {
        this.setState({ [prop]: e })
    }






    toback() {
        window.location.href = "./apply.html";
    }

    uploadfile(e) {
        // console.log(e,'uploadfile');
        let { chosefile } = this.state, that = this;
        if (!chosefile) {
            alert('请先选择文件')
        } else {
            var form = document.getElementById('uploadthis'),
                formData = new FormData(form);
            $.ajax({
                url: `${API_HEAD}payroll/upload`,
                type: "post",
                data: formData,
                processData: false,
                contentType: false,
                success: function (res) {
                    if (res) {
                        alert("上传成功！");
                        console.log(res, 'resres');
                        that.setState({ path: JSON.parse(res).data.oldPath })
                    }
                },
                error: function (err) {
                    alert("网络连接失败,稍后重试", err);
                }

            })
        }
    }
    // 图片
    filechangeimg(e) {
        var that = this;
        var filedata = $('#file' + e)[0].files[0];
        let _name, _fileName, filedatasize = 10240;

        _name = $('#file' + e)[0].value;
        _fileName = _name.substring(_name.lastIndexOf(".") + 1).toLowerCase();
        if (_fileName !== "png" && _fileName !== "jpg" && _fileName !== "gif" && _fileName !== "jpeg") {
            alert("上传图片格式不正确，请重新上传");
        } else {
            if (filedatasize < filedata.size / 1024) {
                alert("上传图片不能大于10M");
                return;
            }

            let filee = e
            var reader = new FileReader();
            reader.readAsDataURL(filedata);
            reader.onload = function (e) {
                var base64str = e.target.result;
                that.putswiperimglistdata([base64str], filee)
            }
        }
    }
    putswiperimglistdata(target, prop) {
        console.log(target, 'target');
        console.log(prop, 'prop');

        let { lbimglist, mpzimglist } = this.state, imgsrc = '', that = this;
        if (prop == 'imgsrc') {
            imgsrc = target[0]
            if (!isBase64(imgsrc)) {
                if (imgsrc.indexOf(`${API_HEAD}`) == -1) {
                    imgsrc = `${API_HEAD}imgs/${imgsrc}`
                }
            }
            that.setState({ [prop]: imgsrc })
        } else {
            let lbhtml = []
            imgsrc = target[0]
            if (!isBase64(imgsrc)) {
                if (imgsrc.indexOf(`${API_HEAD}`) == -1) {
                    imgsrc = `${API_HEAD}imgs/${imgsrc}`
                }
            }
            lbimglist.push(imgsrc)
            lbimglist.forEach((x, i) => {
                lbhtml.push(
                    <div className="lbimg">
                        <img className="img" src={x} />
                        <div className="imgmodel">
                            <div className="delbox">
                                <img src="./src/dellb.png" onClick={this.del_img.bind(this, 'lb', i)} />
                            </div>
                        </div>
                    </div>
                )
            })
            this.setState({ lbhtml, lbimglist })

        }

    }
    preimg() {
        $('#antdimg').click();

    }
    clickupload(e) {
        console.log(11111);
        console.log(e, 'eeeee');
        $('#file' + e).click();
    }

    del_img(prop, i) {
        let { lbimglist } = this.state
        if (prop == 'lb') {
            let lbhtml = []
            lbimglist.splice(i, 1)
            lbimglist.forEach((x, i) => {
                lbhtml.push(
                    <div className="lbimg">

                        <img className="img" src={x} />
                        <div className="imgmodel">
                            <div className="delbox">
                                <img src="./src/dellb.png" onClick={this.del_img.bind(this, 'lb', i)} />

                            </div>
                        </div>
                    </div>
                )
            })
            this.setState({ lbhtml, lbimglist })
        } else {
            this.setState({ imgsrc: '' })
        }

    }
    putswipervidlistdata(target, filedata, prop) {
        let imgsrc = '', that = this;
        imgsrc = target[0]
        console.log(imgsrc, 'imgsrc');
        that.setState({ [prop]: imgsrc, videofile: filedata, })
    }

    changefile(e) {
        this.setState({ chosefile: !0 })
        // console.log(e,'eee');
    }




    render() {
        let { data, u,reason, totalAmt, appRemark, totalCount, unit, stock, lbhtml, imgsrc, ismemberexclusive, isnewcomers, typehtml, price, isindex, isscore, score } = this.state;
        return (
            <div className="breadLinebox">
                <Loading hidden={this.state.showloading != 'ON'} />


                <div className='content_wrap panel-default content_wrap'>
                    <div className="breadLine">
                        <div className="flexitems">
                            <div className="img">
                                <span onClick={this.toback.bind(this)} style={{ cursor: 'pointer' }}>申请管理</span> <span className="fenge">{"/"}</span> 申请详情
                            </div>

                        </div>
                    </div>
                    <div className="contentbox form">
                        <div className="formcontent">
                            <p className='title1'>基本信息</p>
                            <div className="formdiv">

                                <div className="input-group ip1">
                                    <div className="name1">
                                    姓名：
                                    </div>
                                    <div className="name2">
                                    {data.name}
                                    </div>
                                </div>
                                <div className="input-group ip1">
                                    <div className="name1">
                                    手机号：
                                    </div>
                                    <div className="name2">
                                    {data.phone}
                                    </div>
                                </div>

                                <div className="input-group ip1">
                                    <div className="name1">
                                    工作地址：
                                    </div>
                                    <div className="name2">
                                    {u.workplace}
                                    </div>
                                </div>

                                <div className="input-group ip1">
                                    <div className="name1">
                                    工作类型：
                                    </div>
                                    <div className="name2">
                                    {u.worktype}
                                    </div>
                                </div>

                                <div className="input-group ip1">
                                    <div className="name1">
                                    性别：
                                    </div>
                                    <div className="name2">
                                    {u.gender}
                                    </div>
                                </div>

                                <div className="input-group ip1">
                                    <div className="name1">
                                    身份证号：
                                    </div>
                                    <div className="name2">
                                    {data.idcard}
                                    </div>
                                </div>



                                <div className="input-group ip1">
                                    <div className="imgdiv">
                                        <p>身份证照片</p>
                                        {
                                            data['idcsrc'].map(x => {
                                                return (
                                                    <img src={SRC_HEAD + x} alt="" />
                                                )
                                            })
                                        }

                                        {/* <img src={SRC_HEAD+data['idsrc'][1]} alt="" /> */}
                                    </div>
                                </div>

                               
                                <div className="input-group ip1">
                                    <div className="name1">
                                    银行卡号：
                                    </div>
                                    <div className="name2">
                                    {data.bankcard}
                                    </div>
                                </div>

                                <div className="input-group ip1">
                                    <div className="imgdiv">
                                        <p>银行卡照片</p>
                                        <img src={SRC_HEAD + data.banksrc} alt="" />

                                        {/* <img src={SRC_HEAD+data['idsrc'][1]} alt="" /> */}
                                    </div>
                                </div>

                                <div className="input-group ip1">
                                    <div className="imgdiv">
                                        <p>凭证</p>
                                        <img src={SRC_HEAD + data.pz} alt="" />

                                        {/* <img src={SRC_HEAD+data['idsrc'][1]} alt="" /> */}
                                    </div>
                                </div>

                                <div className="input-group ip1">
                                    <div className="imgdiv bc">
                                        <p>补充资料</p> 
                                        <div className="bcimgs">
                                            
                                       
                                        {
                                            data['data1'].split(',').map(x => {
                                                return (
                                                    <img src={SRC_HEAD + x} alt="" /> 
                                                )
                                            })
                                        }
                                         </div>

                                    </div>
                                </div>








                                {/* <div className="input-group">
                                    <div className="parametermane">
                                        <span className="red mr5">*</span>
                                        <span>商品单位：</span>
                                    </div>
                                    <div>
                                        <antd.Input placeholder="请输入" allowClear value={unit} onChange={this.inputchange.bind(this, 'unit')} className="input" />
                                    </div>
                                </div>
                                <div className="input-group">
                                    <div className="parametermane">
                                        <span className="red mr5">*</span>
                                        <span>商品库存：</span>
                                    </div>
                                    <div>
                                        <antd.InputNumber min={0} precision={0}  style={{ width: "300px" }} value={stock} onChange={this.inputchange3.bind(this, 'stock')} />
                                    </div>
                                </div>
                                <div className="input-group">
                                    <div className="parametermane">
                                        <span className="red mr5">*</span>
                                        <span>轮播：</span>
                                    </div>
                                    <input onChange={this.filechangeimg.bind(this, 'lb')} type='file' id='filelb' style={{ display: "none" }} />
                                    <div className="lbimgBox" onClick={this.clickupload.bind(this, 'lb')} >
                                        <img className="addlbimg" src="./src/addlb.png" alt="" />
                                    </div>
                                    {lbhtml}
                                </div>

                                <div className="input-group">
                                    <div className="parametermane">
                                        <span className="red mr5">*</span>
                                        <span>排序：</span>
                                    </div>
                                    <div>
                                        <antd.InputNumber min={1} max={99} precision={0}  style={{ width: "300px" }} value={orders} onChange={this.inputchange3.bind(this, 'orders')} />
                                    </div>
                                </div>
                                <div className="input-group">
                                    <div className="parametermane">
                                        <span className="red mr5">*</span>
                                        <span>商品分类：</span>
                                    </div>
                                    <div className="mallradiobox " style={{ width: "300px" }} >
                                        <select value={this.state.type} onChange={this.inputchange.bind(this, 'type')}>
                                            {typehtml}
                                        </select>
                                    </div>
                                </div>
                                <div className="input-group">
                                    <div className="parametermane">
                                        <span>是否新人专享：</span>
                                    </div>
                                    <div>
                                        <antd.Switch checked={isnewcomers == "1" ? true : false} onChange={this.inputchange1.bind(this, 'isnewcomers')} />
                                    </div>
                                </div>
                                <div className="input-group">
                                    <div className="parametermane">
                                        <span>是否会员专享：</span>
                                    </div>
                                    <div >
                                        <antd.Switch checked={ismemberexclusive == "1" ? true : false} onChange={this.inputchange1.bind(this, 'ismemberexclusive')} />
                                    </div>
                                </div>
                                <div className="input-group">
                                    <div className="parametermane">
                                        <span>是否首页显示：</span>
                                    </div>
                                    <div >
                                        <antd.Switch checked={isindex == "1" ? true : false} onChange={this.inputchange1.bind(this, 'isindex')} />
                                    </div>
                                </div> */}
                                {/* <div className="input-group">
                                    <div className="parametermane">
                                        <span>是否可积分兑换：</span>
                                    </div>
                                    <div style={{marginRight:'20px'}}>
                                        <antd.Switch checked={isscore == "1" ? true : false} onChange={this.inputchange1.bind(this, 'isscore')} />
                                    </div>
                                    <antd.InputNumber  placeholder='请输入兑换该商品的积分' min={0} precision={0}  style={{ width: "300px",display:isscore=='1'?'':'none' }} value={score} onChange={this.inputchange3.bind(this, 'score')} />
                                </div> */}
                                {/* <div className="w100">
                                    <div className="titlebox">
                                        <span>商品详情</span>
                                    </div>
                                    <div className="input-group w100">
                                        <textarea id={'ueditor'} style={{ width: "50vw", height: "50vh" }} ></textarea>
                                    </div>
                                </div> */}
                                <div className="input-group">
                                    <div className="parametermane">
                                        <span className="red mr5">*</span>
                                        <span>描述</span>
                                    </div>
                                    <textarea value={reason} onChange={this.inputchange.bind(this, 'reason')} id={'ueditor'} style={{ width: "30vw", height: "20vh" }} ></textarea>
                                </div>
                            </div>

                        </div>
                        <div className="submitbox">
                            <button type="button" onClick={this.submit.bind(this,'pass')} className="submitbutton">通过</button>
                            <button type="button" onClick={this.submit.bind(this,'refuse')} className="submitbutton" style={{ marginLeft: '100' }}>驳回</button>
                            <button type="button" onClick={this.toback.bind(this)} className="submitbutton" style={{ marginLeft: '100' }}>返回</button>
                        </div>
                    </div>
                </div>
            </div>


        )


    }
}





ReactDOM.render(
    <div>
        <TopLine />
        <div id='body'>
            <LeftMenu code='apply' height='apply' />
            <Main />
        </div>
    </div>
    // <Barrage/>
    , $('.container')[0]
)